<template>
	<view class="content">
		<image class="logo" src="/static/logo.png"></image>
		<view class="text-area">
			<text class="title">{{title}}</text>
		</view>
		<view>
			<form>
				<view class="inline">
					<text>姓名</text><input class="input" v-model="user.name">
				</view>
				<view class="inline">
					<text>住址</text><input class="input" v-model="user.addr">
				</view>
				<view class="inline">
					<text>性别</text>
					<radio-group class="uni-flex" v-model="user.sex">
						<label><radio color="#f09625" value="0" :checked="user.sex == 0"/>男</label>
						<label><radio color="#f09625" value="1" :checked="user.sex == 1"/>女</label>
					</radio-group>
				</view>
				<button @click="submitUser">提交Http</button>
				<button @click="storageUser">本地存储</button>
				<button @click="getGlobalData">获取全局变量</button>
				<button @click="redirect">界面跳转</button>
				<button @click="condition">条件编译</button>
			</form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				user:{
					name:'',
					addr:'',
					sex:1,
				}
			}
		},
		onLoad() {
			console.log('indexOnLoad')
		},
		onReady(){
			console.log('indexOnReady')
		},
		onShow(){
			console.log('indexOnShow')
		},
		onHide(){
			console.log('indexOnHide')
		},
		onUnload(){
			console.log('indexOnUnload')
		},
		methods: {
			submitUser(){
				console.log('submitUser',this.user)
				//以下为测试地址
				var url = 'http://192.168.103.172:8184/ccis-cat/api/distribute/login' 
				uni.request({
					url:url,
					method:'POST',
					data:{username:this.user.name,password:'123456'},
					dataType:'json',
					success:function(res){
						console.log('success',res)
						uni.showToast({
							title:'请求响应成功',
							icon:'none'
						})
					},
					fail:function(res) {
						console.log('success',res)
						uni.showToast({
							title:'请求异常，请稍后再试',
							icon:'none'
						})
					}
				})
				
			},
			storageUser(){
				console.log('storageUser',this.user)
				//uni.setStorageSync为同步存储，异步存储为uni.setStorage()
				var user = uni.getStorageSync('user_key')
				console.log('userGetStorage',user)
				uni.setStorageSync('user_key',this.user)
			},
			getGlobalData(){
				var app = getApp()
				console.log('appGlobalData',app.globalData)
				app.globalData.demoTitle = '临时赋值:'+this.user.name
				app.globalData.user=this.user
			},
			redirect(){
				//界面跳转
				uni.navigateTo({
					url:'/pages/user/user?id=2&name=中文'
				})
			},
			condition(){
				//注册全局的事件
				uni.$on('wxLogin',function(param){
					console.log('wxLoginParam',param)
					uni.showToast({
						title:'全局事件，参数:'+param.name,icon:'none'
					})
				})
				//界面跳转
				uni.navigateTo({
					url:'/pages/index/login?id=2&name=中文'
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	.input {
		border: 1px solid #007AFF;
	}
	.inline{
		display: inline;
	}
</style>